import {useMemo} from "react"
import Icon from "@ant-design/icons";
import * as icons from '@ant-design/icons'
import * as customIcons from "@/assets/icon"

type propsInterface = {
    name: string,
    type?: string,
    size?: number,
    color?: string,
    profix?: string
}

export default function SvgIcon(props: propsInterface) {
    const size = props.size ?? 36
    const color = props.color ?? ""
    const profix = props.profix ?? "icon"
    const name = props.name

    const iconList = useMemo<any>(() => {
        return {...customIcons, ...icons}
    }, []);

    const iconName = useMemo<string>(() => {
        return name
    }, [profix, name])
    return (
        <>
            {
                iconList[iconName] != undefined && iconList[iconName] !== '' ? <><Icon component={iconList[iconName]}
                                                                                       style={{
                                                                                           color: color,
                                                                                           fontSize: size
                                                                                       }}/></> : <Icon></Icon>
            }
        </>
    )
}
